<style>
    body {
        background: #ffffff;
    }

    .layui-inline {
        border: 1px solid #eee;
        width: 170px;
        height: 330px;
        margin-right: 12px;
        line-height: 1.9;
        text-indent: 12px;
        overflow: hidden;
    }

    .layui-inline ul li {
        cursor: pointer;
    }

    .active {
        color: #009688;
    }

    .more-right {
        width: 400px;
    }

    .spec-title {
        border-bottom: 1px solid #ccc;
        height: 42px;
        line-height: 42px;
        box-sizing: border-box;
    }

    .layui-btn-normal {
        color: #fff;
    }

    .tip-font {
        margin: 126px 0 0 100px;
    }

</style>
</head>
<body>

<div class="layui-inline">
    <div class="spec-title">选择规格[单选]</div>
    <div class="layui-input-inline">
        <div class="layui-side-scroll">
            <ul class="spec-left">
            </ul>
        </div>
    </div>
</div>

<div class="layui-inline more-right">
    <div class="spec-title">选择规格值[可多选] <input type="text" id="add-spec-tags"
                                              style="padding-left: 5px; width: 252px;margin-left: 10px;display:inline-block;"
                                              placeholder="新增规格名、按回车键确定添加" autocomplete="off" class="layui-input"></div>
    <div class="layui-input-inline">
        <div class="spec-right">
            <p class="tip-font">请选择左侧规格列表</p>
        </div>
    </div>
</div>

<div class="layui-input-block"></div>
<button class="layui-btn classify-btn" style="margin-left:240px;">确 定</button>
